<template>
    <el-select v-model="regionId" filterable placeholder="请选择区域" clearable @change="changeParent">
        <el-option v-for="item in regions" :key="item.id" :label="item.name" :value="item.id"> </el-option>
    </el-select>
</template>
<script>
import { findAllRegion } from "../../api/region"
export default {
    name:"RegionList",
    props: ['region'],
    data(){
        return {
            regions:[],
            regionId:this.region
        }
    },
    // computed: {
    //     regionId:{
    //         get:function(){
    //             console.log("//////////////后去修改之后的regions的值",this.region)
    //             return this.region
    //         },
    //         set: function(val){
                
    //         }
    //     }
    // },
    watch: {
        region(val){
            this.regionId = val;
        }
    },
    created () {
        findAllRegion().then(resp=>{
            this.regions = resp.data
        })
    },
    methods: {
        changeParent(val){
            console.log("regionId的值改变。。。。",val)
            this.$emit("changeRegion",val); //触发使用ReginList组件时，给RegionList绑定的监听器（）。
        }
    }
};
</script>